/**
 * @description 单条文章
 */
import React from 'react';
import classnames from "classnames";
import "./styles/App.less";
import icon_zan from "images/icon/zan.png";
import icon_like from "images/icon/like.png";

class App extends React.Component {
  constructor(props) {
    super(props);

    this.state = {};
  }

  render() {
    return (
      <div className={classnames("x-articleItem", "x-part")} onClick={()=>{
        location.href = `./market.html#/ArticleDetail/${this.props.data.id}`;
      }}>
        <div className={"x-articleItem-img"} style={{backgroundImage:`url(${this.props.data.articlePic})`}}></div>
        <div className={"x-articleItem-info"}>
          <div className={"x-articleItem-info-top"}>
            <div className={"x-articleItem-info-name"}>
              <span>{this.props.data.articleTitle}</span>
            </div>
            <div className={"x-articleItem-author"}>
              <span>作者：{this.props.data.author}</span>
            </div>
          </div>
          <div className={"x-articleItem-info-bottom"}>
            <div className="x-articleItem-info-zan">
              <img src={icon_zan} alt="" />
              <span>{this.props.data.likeCount}</span>
            </div>
            <div className="x-articleItem-info-like">
              <img src={icon_like} alt="" />
              <span>{this.props.data.collectCount}</span>
            </div>
          </div>
        </div>
      </div>
    );
  }
}

App.defaultProps = {};

export default App;
